<!--
 * @Author: your name
 * @Date: 2021-10-18 19:49:39
 * @LastEditTime: 2021-11-18 14:51:26
 * @LastEditors: Please set LastEditors
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \my-vue-app\src\App.vue
-->
<script setup>
// This starter template is using Vue 3 <script setup> SFCs
// Check out https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup
import * as lodash from "lodash-es";
import HelloWorld from "./components/HelloWorld.vue";
import React, {Component} from 'react'
import Test from "./test.jsx";
import { print } from "utils/utils.ts";
import { getCompany } from "@zhuiyi-diy";
import { onMounted } from "vue";
import axios from "/http/index.js";

console.log('react',React,'Component',Componentb~1001)
console.log(lodash, "ttccsddd");
console.log(import.meta.env,'ttttt')
console.log(import.meta.env.MODE, "env");
console.log(Test);
print("hello Vite");
getCompany();
</script>

<script>
export default {
  data() {
    return {
      aunchImgUrl: "",
      adsImgUrl: "",
    };
  },
  async mounted() {},
  methods: {
    async getImgData() {
      console.log("1111111111111");
      try {
        const data = await axios.get("/getlaunchimg");
        console.log(data, "tt");
        this.launchImgUrl = data.launchImgUrl;
        this.adsImgUrl = data.logoImgUrl;
        this.$forceUpdate()
      } catch (error) {
        console.log(error);
      }
      console.log(this.launchImgUrl, this.adsImgUrl, "ttt");
    },
  },
};
</script>
<template>
  <img alt="Vue logo" src="./assets/logo.png" />
  <HelloWorld msg="Hello Vue 3 + Vite" />
  <Test />
  <div>
    <div class="startBtn" v-on:click="getImgData">点击获取：启动图和广告图</div>
    <div class="imgArea" v-show="launchImgUrl">
      <img :src="launchImgUrl" alt="启动图" />
      <img :src="adsImgUrl" alt="广告图" />
    </div>
  </div>
</template>

<style lang="less">
@import url('./style/common.less');

#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
.startBtn {
  width: 200px;
  height: 50px;
  line-height: 50px;
  padding: 8px 16px;
  border-radius: 50px;
  margin: 10px auto;
  border: 1px solid #f0f0f0;
  font-size: 14px;
  color: @red;
  background-color:@bg-color ;
  &:hover {
    background: rgba(21, 21, 236, 0.808);
    color: white;
    cursor: pointer;
  }
}
.imgArea {
  width: 500px;
  height: 325px;
  margin: 20px auto;
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
}
</style>
